<template>
    <div class=''>
      <van-form @submit="onSubmit">
  
    <input type="file"@change="updataImg" >
    <img
        width="100"
        height="100"
        alt=""
        :src="imgUrl"
        class="avatar"
        />
     <van-field
      v-model="nickName"
      type="text"
      name="nickName"
      label="昵称"
      placeholder="昵称"
     
    />
  </van-cell-group>
  <div style="margin: 16px;">
    <van-button round block type="primary" native-type="submit">
      提交修改
    </van-button>
  </div>
</van-form>
    </div>
</template>

<script>
import {getUserIfo , changeUserIfo ,uploadFiles} from '@/api/user';
export default {
    
    data() {
        
        return {
            nickName:"",
            avatar:"",
            imgUrl:"",
        };
    },
    computed: {},
    watch: {},
    
    methods: {
    async init(){
          const res = await getUserIfo({
            processData: false,
            contentType: false,
          });
          console.log("res",res);
          this.data = res;
          this.imgUrl = res.avatar;
          this.nickName = res.nickName;
     
    },
    //图片上传
    async updataImg(e){
      let file = e.target.files[0];
      console.log(file);
      let params = new FormData();
      params.append("file",file);
      const res = await uploadFiles(params);
      console.log(res);
      this.imgUrl = "http://lanlianhua.work:3009"+res.info
    },
   async onSubmit(val){
      console.log(val);
      const res = await changeUserIfo({
        nickName:this.nickName,
        avatar:this.imgUrl,
        });
        console.log(res);
       if(res.code =="success"){
        this.$router.push("/mine");
       }
    },
    
    },
    created() {
        this.init();
    },
    mounted() {
        
    },
    components: {},
    }
</script>
<style scoped>
    
</style>